<template>
    <div class="data">
        <div class="date">
            活动时间&nbsp;&nbsp;
            <el-date-picker v-model="value1" type="date" placeholder="2016-12-31" style="width:260px;"></el-date-picker>
            &nbsp;&nbsp;~&nbsp;&nbsp;
            <el-date-picker v-model="value2" type="date" style="width:260px;"></el-date-picker>
            <el-input v-model="data_keyword" placeholder="请输入关键词" style="width:280px;margin-left:0;"></el-input>
            <el-button type="primary">搜索</el-button>
        </div>
        <el-table :data="tableData" stripe border style="width: 100%;margin-top:20px;" :default-sort = "{prop: 'date', order: 'descending'}">
            <el-table-column prop="name" label="活动名称" width="200"></el-table-column>
            <el-table-column prop="time" label="活动时间" sortable width="180"></el-table-column>
            <el-table-column prop="key" label="门票收益(元)" sortable></el-table-column>
            <el-table-column prop="price" label="打赏收益(元)" sortable></el-table-column>
            <el-table-column prop="minute" label="直播时长(分钟)" sortable></el-table-column>
        </el-table>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                value1: '',
                value2: '',
                data_keyword: '',
                tableData: [{
                        name: '变形金刚来中国啦',
                        time: '2016-12-31 13:00',
                        key: '37890',
                        price: '4793',
                        minute: '74390'
                    }, {
                        name: '变形金刚来中国啦',
                        time: '2016-12-31 13:00',
                        key: '37890',
                        price: '4793',
                        minute: '74390'
                    }, {
                        name: '变形金刚来中国啦',
                        time: '2016-12-31 13:00',
                        key: '37890',
                        price: '4793',
                        minute: '74390'
                    }, {
                        name: '变形金刚来中国啦',
                        time: '2016-12-31 13:00',
                        key: '37890',
                        price: '4793',
                        minute: '74390'
                }]
            };
        },
        methods: {
        }
    }
</script>

<style>
    * {
        margin: 0;
        padding: 0;
    }

    .data{
        width: 88%;
        height: 500px;
        margin-top: 120px;
        margin-left: 105px;
    }

    .date{
        width: 100%;
    }
</style>